<template>
  <div id="app" >
      <!--路由视图  -->
      <router-view/>

  </div>
</template>

<script>
export default {
    name: 'app',
    data(){
        return {
            num: 1,
        }
    },
    // data(){return {}},
    components:{},
    created(){},
    computed:{},
    methods:{},
    mounted(){},
    // watch: {}
    watch:{
        '$route':{
            handler(to, from) {
                console.log(`here is App.vue`);
                console.log('num', this.num++)
                console.log('to', to)
                console.log('from', from)
            },
            deep:true,
        }
    }
}
</script>

<style  lang="less" >
html,body{
    padding: 0;
    margin: 0;
    width: 100%;
    height: 100%;
}
#app{
    width: 100%;
    height: 100%;
    font-size: .014rem !important;
}
.can-click{
    cursor: pointer;
}
/*字体颜色开始*/
.font-bold{
    font-weight: bold;
}
.font-color-orange{
    color: @font_color1;
}
.font-color-red{
    color: @font_color2;
}
.font-color-greed{
    color: @font_color3;
}
.font-color-blue {
    color: @font_color4;
}
.font-color-purple {
    color: @font_color5;
}
/*字体颜色结束*/
/*箭头开始*/
.jiantou-img{
    width: .02rem;
    height: .02rem;
    margin-bottom: .006rem;
    display: inline-block;
    vertical-align: middle;
}

.data-up{
    background: url('assets/images/foot/箭头up.png') no-repeat center;
}
.data-down{
    background: url('assets/images/foot/箭头down.png') no-repeat center;
}
.data-omit{
    background: url('assets/images/icon/省略号.png') no-repeat center;
}
/*箭头结束*/
/*el样式调整 start*/
.el-message{
    font-size: .02rem;
}
/*弹框插件 start*/
.el-dialog{
    border-radius: .01rem !important;
    .el-dialog__header{
        border-radius: .01rem .01rem 0 0 !important;
        padding: .01rem .02rem .01rem !important;
        background: @bg_color4;
        .el-dialog__title{
            padding-left: .02rem;
            font-size: .016rem !important;
            font-weight: bold;
        }
        .el-dialog__headerbtn{
            top: .006rem !important;
            font-size: .024rem;
        }
    }
    .el-dialog__header::before {
        content: ' ';
        border-left: 6px solid @font_color1;
        height: .016rem;
        position: absolute;
        margin-top: .004rem;
    }
    .el-dialog__body{
        padding: .02rem !important;
    }
}
/*弹框插件 end*/
/*表格插件 start*/
.el-table.module tbody tr.el-table__row:hover>td {
    background-color:@bg_color3!important
}
.el-table.module.table-border{
    margin-top: .01rem;
    border: 1px solid @color6;
    border-radius: .005rem;
    .el-table__header-wrapper{
        tr, th{
            background: @bg_color4;
        }
    }
}
.el-table {
    font-size: 0.014rem !important;
}
.el-table thead tr {
    color: #606266;
}
/*表格插件 end*/
.el-popover{
    background: rgba(0,0,0,0.6) !important;
    border-radius: .006rem !important;
    color: @color3 !important;
}
/*分页插件 start*/
.el-pagination.is-background.module {
    .el-pager {
        li:not(.disabled):hover{
            color: @color6 !important;
        }
        li:not(.disabled).active{
            background-color: @font_color1 !important;
        }
    }
    .el-input.is-active .el-input__inner, .el-input__inner:focus{
        border-color: @font_color1 !important;
    }
}
/*分页插件 end*/
/*el样式调整 end*/
</style>
